import React, { useEffect } from 'react'
import Router from './router';
import { useLocation, useNavigate } from 'react-router-dom'
const App = () => {
  return (
    <div>
      <Router></Router>
    </div>
  )
}

function withLogin(Comp) {
  return () => {
    // 拦截

    const { pathname } = useLocation();
    const navigate = useNavigate()
    useEffect(() => {
      const token = localStorage.getItem('token');
      if (!token && pathname !== '/login') {
        navigate('/login')
      }
    }, [pathname])
    return <Comp></Comp>
  }
}

export default withLogin(App)






// 高阶组件： 本质就是一个函数， 但是该函数接受的参数是一个组件， 返回的结果是一个组件， 后来给这个函数起名在叫做高阶组件